/*--------------------分割线--------------------*/
.loadingWaver {
  z-index: 999;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 120px;
  height: 120px;
  overflow: hidden;
  border-radius: 5%;
  background: rgba(0, 0, 0, 0.75);
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);

  .icon {
    position: relative;
    width: 50%;
    height: 50%;
    margin: 25% 25% 0 25%;

    div{
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
      width: 100%;
      height: 100%;
      overflow: hidden;
      border-radius: 100%;
      background-color: #FFF;
      animation: loadingOption 1s 0s linear infinite;
      -o-animation: loadingOption 1s 0s linear infinite;
      -moz-animation: loadingOption 1s 0s linear infinite;
      -webkit-animation: loadingOption 1s 0s linear infinite;
    }

    div:nth-child(2){
      transition-delay: 0.2s;
      -o-animation-delay: 0.2s;
      -moz-animation-delay: 0.2s;
      -webkit-animation-delay: 0.2s;
    }

    div:nth-child(3){
      transition-delay: 0.4s;
      -o-animation-delay: 0.4s;
      -moz-animation-delay: 0.4s;
      -webkit-animation-delay: 0.4s;
    }

    @keyframes loadingOption {
      0%{
        opacity: 0;
        transform: scale(0);
      }
      5% {
        opacity: 0.75;
      }
      100% {
        opacity: 0;
        transform: scale(1);
      }
    }

    @-o-keyframes loadingOption {
      0%{
        opacity: 0;
        -o-transform: scale(0);
      }
      5% {
        opacity: 0.75;
      }
      100% {
        opacity: 0;
        -o-transform: scale(1);
      }
    }

    @-moz-keyframes loadingOption {
      0%{
        opacity: 0;
        -moz-transform: scale(0);
      }
      5% {
        opacity: 0.75;
      }
      100% {
        opacity: 0;
        -moz-transform: scale(1);
      }
    }

    @-webkit-keyframes loadingOption {
      0%{
        opacity: 0;
        -webkit-transform: scale(0);
      }
      5% {
        opacity: 0.75;
      }
      100% {
        opacity: 0;
        -webkit-transform: scale(1);
      }
    }
  }

  .icon.hasText {
    margin: 18% 25% 0 25%;
  }

  .title {
    height: 20%;
    width: 100%;
    color: #FFF;
    font-size: 15px;
    display: flex;
    display: -webkit-box;
    display: -webkit-flex;
    align-items: center;
    -webkit-align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
  }
}

/*--------------------分割线--------------------*/
.loadingBanner {
  width: 100%;
  height: 30px;
  z-index: 999;
  .icon {
    position: relative;
    width: 30px;
    height: 100%;
    margin: 0 auto;

    div{
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
      width: 100%;
      height: 100%;
      border-radius: 100%;
      background: rgba(0,0,0,0.5);
      animation: loadingOption 1s 0s linear infinite;
      -o-animation: loadingOption 1s 0s linear infinite;
      -moz-animation: loadingOption 1s 0s linear infinite;
      -webkit-animation: loadingOption 1s 0s linear infinite;
    }

    div:nth-child(2){
      transition-delay: 0.2s;
      -o-animation-delay: 0.2s;
      -moz-animation-delay: 0.2s;
      -webkit-animation-delay: 0.2s;
    }

    div:nth-child(3){
      transition-delay: 0.4s;
      -o-animation-delay: 0.4s;
      -moz-animation-delay: 0.4s;
      -webkit-animation-delay: 0.4s;
    }

    @keyframes loadingOption {
      0%{
        opacity: 0;
        transform: scale(0);
      }
      5% {
        opacity: 0.75;
      }
      100% {
        opacity: 0;
        transform: scale(1);
      }
    }

    @-o-keyframes loadingOption {
      0%{
        opacity: 0;
        -o-transform: scale(0);
      }
      5% {
        opacity: 0.75;
      }
      100% {
        opacity: 0;
        -o-transform: scale(1);
      }
    }

    @-moz-keyframes loadingOption {
      0%{
        opacity: 0;
        -moz-transform: scale(0);
      }
      5% {
        opacity: 0.75;
      }
      100% {
        opacity: 0;
        -moz-transform: scale(1);
      }
    }

    @-webkit-keyframes loadingOption {
      0%{
        opacity: 0;
        -webkit-transform: scale(0);
      }
      5% {
        opacity: 0.75;
      }
      100% {
        opacity: 0;
        -webkit-transform: scale(1);
      }
    }
  }
}